<script setup>
  import { ref } from 'vue'
  // model 是一个响应式数据 所以可以直接修改值
  const model = defineModel()
  console.log(model);
  console.log(ref(''));
  /* 
    不过 defineModel 底层逻辑还是之前那样写的
      父亲：
        通过 :modelValue 传入属性
        通过 @update:modelValue 来传入数据
      孩子：
        通过 defineProps 来获得对应的属性
        通过 defineEmits 来获得对应的事件
        再通过 emits('@update:modelValue', 值) 来给父亲传数据
  */
</script>

<template>
  <!-- 由于 model 是一个响应式数据 所以只要将其用 v-model 绑定即可 -->
  <select v-model="model">
    <option value="11">小明</option>
    <option value="22">小红</option>
    <option value="33">小亮</option>
    <option value="44">小美</option>
    <option value="55">小强</option>
  </select>
</template>


<style scoped></style>